.container{
  width: 100%;
  background-color: #F6F9FE;
  min-height: e("calc(100vh - 540px - 137px)");
  box-sizing: border-box;
  padding-bottom: 56px;
}
.top{
  padding-top: 50px;
  height:170px;
  background-color: #1E8AE0;
  box-sizing: content-box;
  display: flex;
  justify-content: center;
}
.total{
  width: 400px;
  padding-left: 108px;
  padding-top: 28px;
}
.totalTitle{
  line-height: 56px;
  font-size:40px;
  color:#107ad9;
  font-family:PingFangSC-Light;
  margin-left: 18px;
  margin-bottom: 16px;
}
.totalMonery{
  width:235px;
  height:30px;
  line-height: 30px;
  text-align: center;
  background:rgba(255,255,255,1);
  border-radius: 16px ;
  font-size:14px;
  color:rgba(30,138,224,1);
  span{
    font-size:20px;
    display: inline-block;
    font-family:Arial-BoldMT;
    color:rgba(30,138,224,1);
    // line-height: 30px;
    margin: 0 6px;
    margin-top: -4px;
    vertical-align: middle;
  }
}
.qrcode{
  width: 590px;
  height: 100%;
  padding: 30px 0;
  display: flex;
  padding-left: 218px;
  padding-right: 85px;
  background: url('../../assets/bj.svg');
  background-repeat:no-repeat;
  img{
    width: 108px;
    height: 108px;
    margin-right: 28px;
  }
}
.ranking{
  height:138px;
  background-color: #1E8AE0;
  display: flex;
  justify-content: center;
}
.rankingItem{
  height:138px;
  width:330px;
  display: flex;
  align-items:center;
  justify-content: center;
  background-color: #0295F2;
  &.one{
    background-color: #0295F2;
  }
  &.two{
    background-color: #12A2FD;
  }
  &.three{
    background-color: #3BB3FF;
  }
  .icon{
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-color: #ffffff;
    margin-right: 14px;
  }
  .info{
    height: 56px;
  }
  .name{
    font-size:20px;
    color:#ffffff;
  }
  .donation{
    font-size:16px;
    color:#ffffff;
  }
}
.donationlist{
  // display: flex;
  margin: auto;
  margin-top: 30px;
  width: 990px;
  background-color: #FFFFFF;
  border-radius: 4px ;
  box-sizing: border-box;
}
